<template>
  <div class="contentPricing-box">
    <div class="row">
      <ComForm :list="comForm"></ComForm>
    </div>

    <div class="table">
      <ComTable :modes="tableModes">
        <el-table-column align="left">
          <template>
            <el-button>修改</el-button>
          </template>
        </el-table-column>
      </ComTable>
    </div>
  </div>
</template>

<script>
import { getPriceDocListApi } from "@/wss/api/financial/pricing/priceDoc.js";
import ComTable from "../../../components/comTable.vue";
import ComForm from "../../../components/comForm.vue";
export default {
  components: { ComTable, ComForm },
  data() {
    return {
      value: "",
      options: [{}],
      //   表格属性
      tableModes: [
        {
          showOverflowTooltip: true,

          width: 200,
          label: "订单号",
          mode: "docType",
          showOverflowTooltip: true,
        },
        {
          label: "提现方式",
          mode: "timeQuantum",
        },
        {
          label: "用户昵称",
          mode: "grantNumber",
          showOverflowTooltip: true,
        },
        {
          label: "手机号",
          mode: "grantRental",
          showOverflowTooltip: true,
        },
        {
          label: "提现金额（元）",
          mode: "grantRental",
          showOverflowTooltip: true,
        },
        {
          label: "到账账户",
          mode: "grantRental",
          showOverflowTooltip: true,
        },

        {
          label: "到账时间",
          mode: "grantRental",
          showOverflowTooltip: true,
        },
      ],
      comForm: {
        modes: [
          {
            placeholder: "请输入订单号",
            formType: "input",
            mode: "type",
            label: "提现订单号",
            value: "",
          },
          {
            placeholder: "请输入用户昵称",
            formType: "input",
            mode: "type",
            label: "用户昵称",
            value: "",
          },
          {
            placeholder: "",
            formType: "input",
            mode: "scope",
            label: "手机号",
            value: "",
            select: [],
          },
          {
            placeholder: "",
            formType: "select",
            mode: "scope",
            label: "提现方式",
            value: "",
            select: [],
          },
          {
            placeholder: "",
            formType: "select",
            mode: "scope",
            label: "提现时间",
            value: "",
            select: [],
          },
          {
            placeholder: "请选择日期",
            formType: "date",
            mode: "publishTime",
            label: "申请时间",
            value: null,
            pickerType: "datetime",
          },
        ],
      },
    };
  },
  created() {
    this.getPriceDocListFn();
  },
  methods: {
    //   获取内容定价list
    async getPriceDocListFn() {
      let res = await getPriceDocListApi();
      console.log(res);
    },
  },
};
</script>

<style lang="scss" scoped>
.contentPricing-box {
  padding: 20px;
  background-color: #ffffff;
  .title {
    padding-top: 20px;
    margin-right: 20px;
  }
  .btnBox {
    margin-left: 20px;
  }
  .row {
    padding-left: 10px;
    width: 100%;
    box-sizing: border-box;
    padding-top: 40px;
    // height: 100px;
    min-height: 100px;
    background: #f2f2f2;
    justify-content: flex-start;
    .col {
      display: flex;
    }
  }
}
</style>